<template>
  <div>
    <van-nav-bar
      :z-index="999"
      :fixed="true"
      left-arrow
      @click-left="onClickLeft"
      @click-right="onClickRight"
      :placeholder="true"
      title="创建帖子"
    >
      <template #right>
        <div class="right-title">
          发布
        </div>
      </template>
    </van-nav-bar>
    <!-- 留言内容 -->
    <van-field
      v-model="message"
      rows="3"
      autosize
      type="textarea"
      placeholder="说点什么吧..."
    />
    <div class="notices-uploading">
      <van-uploader
        v-model="fileList"
        :max-size="500 * 1024"
        multiple
        :max-count="4"
        preview-size="77px"
        @oversize="onOversize"
      />
      <!-- :after-read="afterRead" -->
    </div>
    <div class="notices-course">{{ type }}</div>
  </div>
</template>

<script>
import { IssueInvitation } from "../../assets/js/api/exam.js";
import { Toast, Dialog } from "vant";
export default {
  name: "ReleasingNotices",
  data() {
    return {
      message: "",
      type: "",
      fileList: [],
      array: []
    };
  },
  created() {
    // console.log(this.$route.params.type);
    switch (this.$route.params.type) {
      case "1":
        this.type = "科目一";
        break;

      case "2":
        this.type = "科目二";
        break;

      case "3":
        this.type = "科目三";
        break;

      case "4":
        this.type = "科目四";
        break;

      case "5":
        this.type = "拿本";
        break;
    }
  },
  methods: {
    // afterRead(file) {
    //   // 此时可以自行将文件上传至服务器
    //   console.log(file);
    // },

    onClickRight() {
      // console.log(this.fileList);
      // for (let i = 0; i < this.fileList.length; i++) {
      //   // base64编码的图片
      //   var base64Img = this.fileList[i].content;
      //   //转换图片文件
      //   var imgFile = this.base64ImgtoFile(base64Img);
      //   console.log(imgFile);
      // }
      // console.log(this.fileList);
      // var array = [];
      if (this.message == "") {
        Toast.fail("内容不能为空");
        return;
      }
      // console.log(this.fileList);
      for (let i = 0; i < this.fileList.length; i++) {
        this.array.push(this.fileList[i].content);
      }
      // console.log(this.array);

      let obj = {
        topArticle: false,
        articleContent: this.message,
        articleTypeId: this.$route.params.type,
        appimgs: this.array,
        articleTitle: this.message
      };
      // console.log(obj);
      IssueInvitation(obj).then(res => {
        console.log(res);
        if (res.code == 0) {
          Toast.success("发表成功");
          this.message = "";
          this.fileList = [];
        }
        // console.log(res);
      });
    },
    base64ImgtoFile(dataurl, filename = "file") {
      let arr = dataurl.split(",");
      let mime = arr[0].match(/:(.*?);/)[1];
      let suffix = mime.split("/")[1];
      let bstr = atob(arr[1]);
      let n = bstr.length;
      let u8arr = new Uint8Array(n);
      while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
      }
      return new File([u8arr], `${filename}.${suffix}`, {
        type: mime
      });
    },

    // 上传超过限制提示
    onOversize() {
      Toast("文件大小不能超过 500kb");
    },
    onClickLeft() {
      if (this.message != "" || this.fileList.length != 0) {
        Dialog.confirm({
          title: "提示",
          message: "退出后我们将不会为您保存草稿，确定退出吗？"
        })
          .then(() => {
            // on confirm

            this.$router.go(-1);
          })
          .catch(() => {
            // on cancel
          });
      } else {
        this.$router.go(-1);
      }
    }
  },
  components: {
    [Dialog.Component.name]: Dialog.Component
  }
};
</script>

<style></style>
